﻿<%@ Page Title="" Language="vb" AutoEventWireup="false" MasterPageFile="~/Site.Master" CodeBehind="routedetails.aspx.vb" Inherits="SwissBiking.routedetails" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>

<asp:Content ID="Content1" ContentPlaceHolderID="FeaturedContent" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
     <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
    <script>
        function initialize() {
            console.log(document.location.host + "/" + document.getElementById("kmlVar").value);
            var map;
                var mapOptions = {
                    zoom: 8,
                    center: new google.maps.LatLng(46.232459, 6.047026),
                    mapTypeId: google.maps.MapTypeId.SATELLITE
                };
                map = new google.maps.Map(document.getElementById('map-canvas'),
                    mapOptions);


                var ctaLayer = new google.maps.KmlLayer({
                    url: document.location.host + "/" + document.getElementById("kmlVar").value
                });
                ctaLayer.setMap(map);
                
            }

          
        google.maps.event.addDomListener(window, 'load', initialize);

    </script>
   <asp:DetailsView ID="DetailsView1" runat="server" DataSourceID="SqlDataSource1" AutoGenerateRows="false"  class="small-12 collumns" GridLines="None">
    <Fields>
        <asp:TemplateField ShowHeader="false">
            <ItemTemplate>
 <div id="routeHeader">
  <div class="row">
  <div class="left"> 
      <input type="hidden" id="kmlVar" value='<%# Eval("cannonical_kml")%>'></input>
      <h4><asp:Label ID="lengthLabel" runat="server" Text='<%# Eval("title")%>' /></h4>
     <b> Difficulty:</b><asp:Label ID="Label1" runat="server" Text='<%# Eval("difficulty")%>' />
     <b> Trail Type:</b> <asp:Label ID="Label2" runat="server" Text='<%# Eval("type") %>' />
     <b> Trail Length:</b> <asp:Label ID="Label3" runat="server" Text='<%# Eval("length") %>' />
     <b> KML for download:</b><asp:HyperLink runat="server" NavigateUrl='<%# Eval("cannonical_kml")%>' Text='click'></asp:HyperLink>

</div>
<div class="right">
   <b> Rating:</b><asp:Label ID="Label4" runat="server" Text='<%# Eval("rating") %>' /> 
</div>
  </div>   
  <b>Trail Description:</b> <asp:Label ID="Label5" runat="server" Text='<%# Eval("description")%>' />

 </div>
            </ItemTemplate>
        </asp:TemplateField>
    </Fields>
</asp:DetailsView>
         <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:ConnectionStringx %>" ProviderName="<%$ ConnectionStrings:ConnectionStringx.ProviderName %>" SelectCommand="SELECT * FROM [routes] WHERE ([ID] = ?)">
             <SelectParameters>
                 <asp:QueryStringParameter Name="ID" QueryStringField="q" Type="Int32" />
             </SelectParameters>
         </asp:SqlDataSource>
   

         
    <div id="map-canvas" class="" style="width:100%;height:400px;"></div>
       
        
    <div id="imageGallery" class="" >

         <asp:ListView ID="ListView1" runat="server" DataKeyNames="ID" DataSourceID="SqlDataSource2">
        <ItemTemplate>
                <span style="">ID:
                <asp:Label ID="IDLabel" runat="server" Text='<%# Eval("ID") %>' />
                <br />
                caption:
                <asp:Label ID="captionLabel" runat="server" Text='<%# Eval("caption") %>' />
                <br />
                filename:
                    <div>
                    <a class="th" href="<%# Eval("filename") %>">
                    <img src="<%# Eval("filename") %>" width="50px" height="50px">
                    </a>
                    &nbsp;&nbsp;&nbsp;</div>
                rating:
                <asp:Label ID="ratingLabel" runat="server" Text='<%# Eval("rating") %>' />
                <br />
                uploader:
                <asp:Label ID="uploaderLabel" runat="server" Text='<%# Eval("uploader") %>' />
                <br />
              
<br /></span>
</ItemTemplate>
           
        </asp:ListView>








        <asp:SqlDataSource ID="SqlDataSource2" runat="server" ConnectionString="<%$ ConnectionStrings:ConnectionStringx %>" ProviderName="<%$ ConnectionStrings:ConnectionStringx.ProviderName %>" SelectCommand="SELECT * FROM [photos] WHERE ([route] = ?)">
            <SelectParameters>
                <asp:QueryStringParameter Name="route" QueryStringField="q" Type="Int32" />
            </SelectParameters>
        </asp:SqlDataSource>
        <br />
    </div>
    <div id="comments" class="">
        Comments
        <br />
        <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" CellPadding="4" ForeColor="#333333" GridLines="None" Height="110px" Width="950px">
            <AlternatingRowStyle BackColor="White" />
            <Columns>
                <asp:BoundField DataField="poster" HeaderText="poster" SortExpression="poster" />
                <asp:BoundField DataField="comment" HeaderText="comment" SortExpression="comment" />
                <asp:BoundField DataField="title" HeaderText="title" SortExpression="title" />
                <asp:BoundField DataField="date_posted" HeaderText="date_posted" SortExpression="date_posted" />
            </Columns>
            <EditRowStyle BackColor="#2461BF" />
            <FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
            <HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
            <PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
            <RowStyle BackColor="#EFF3FB" />
            <SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />
            <SortedAscendingCellStyle BackColor="#F5F7FB" />
            <SortedAscendingHeaderStyle BackColor="#6D95E1" />
            <SortedDescendingCellStyle BackColor="#E9EBEF" />
            <SortedDescendingHeaderStyle BackColor="#4870BE" />
        </asp:GridView>
        <asp:SqlDataSource ID="SqlDataSource3" runat="server" ConnectionString="<%$ ConnectionStrings:ConnectionStringx %>" ProviderName="<%$ ConnectionStrings:ConnectionStringx.ProviderName %>" SelectCommand="SELECT [poster], [comment], [title], [date_posted] FROM [comments] WHERE ([comment_of] = ?) ORDER BY [date_posted] DESC">
            <SelectParameters>
                <asp:QueryStringParameter Name="comment_of" QueryStringField="q" Type="Int32" />
            </SelectParameters>
        </asp:SqlDataSource>
        
        <div id="commentdiv" class="small-6 columns panel left">
        Comment title <asp:TextBox ID="txtCommentTitle" runat="server"></asp:TextBox>
        <br />
        Comment<br />
        <asp:TextBox ID="txtComment" multiline=true runat="server" Height="40px"></asp:TextBox>
        <br />
        <asp:Button ID="Button3" runat="server" Text="add comment!" />
         </div>
        </div>
        <div id="tagdiv" class="small-6 columns panel right">
        Add a tag
        <asp:TextBox ID="txtTag" runat="server"></asp:TextBox>
        <asp:Button ID="btnTag" runat="server" Text="Add Tag" />
        </div>
           

        <br />
   
      <div id="uploadimagediv" class="small-12 columns">

    <asp:ToolkitScriptManager ID="ScriptManager1" runat="server"></asp:ToolkitScriptManager>
     <asp:ajaxfileupload ID="AjaxFileUpload1" runat="server" OnUploadComplete="AjaxFileUpload1_OnUploadComplete" />
        <p>
 <asp:Label ID="UploadStatusLabel" runat="server" />
        </p>
          </div>

</asp:Content>
